<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>开心网游戏页面</title>
		<link rel="stylesheet" href="css/style.css" />
	</head>
	<body>
		<div class="box clearfix">
			<div class="dong">
				<img src="img/ad3.jpg" />
			</div>
			<div class="top ">
				<div class="top-left fl">
					<img src="img/gameLogo.png" />
				</div>
				<div class="shouye fl">
					<a href="#">首页</a>
				</div>
				<ul class="top-right fr">
					<li>
						<a href="#">注册</a><span>|</span>
					</li>
					<li>
						<a href="#">登录</a><span>|</span>
					</li>
					<li>
						<a href="#">帮助</a><span>|</span>
					</li>
					<li>
						<a href="#">更多</a>
					</li>
				</ul>
			</div>
			<div class="banner clearfix">
				<ul class="banner-left clearfix fl">
					<li class="first clearfix">
						<img src="img/sub-2.gif" class="fl" />
						<span class="fl">征战四方</span>
					</li>
					<li class="two clearfix">
						<img src="img/sub-3.gif" class="fl" />
						<span class="fl">龙将</span>
					</li>
					<li class="two clearfix">
						<img src="img/sub-4.gif" class="fl" />
						<span class="fl">弹弹堂</span>
					</li>
					<li class="two clearfix">
						<img src="img/sub-5.gif" class="fl" />
						<span class="fl">凡人修真2</span>
					</li>
					<li class="two clearfix">
						<img src="img/sub-6.gif" class="fl" />
						<span class="fl">一骑当先</span>
					</li>
					<li class="two clearfix">
						<img src="img/sub-7.gif" class="fl" />
						<span class="fl">宫廷计</span>
					</li>
					<li class="three clearfix">
						<img src="img/sub-8.gif" class="fl" />
						<span class="fl">神仙道</span>
					</li>
				</ul>
				<div class="banner-center fl">
					<div class="ding">
						<span>1</span>
						<span>2</span>
						<span>3</span>
						<span>4</span>
					</div>
					<img src="img/xdtgg_frxz2_44.jpg" />
				</div>
				<div class="banner-right fr">
					<form>
						<p>开心网用户登录</p>
						<div class="user">
							<span>账号：</span>
							<input type="text" placeholder="字母、数字的六位字符" />
						</div>
						<div class="user" style="margin-top: 15px;">
							<span>密码：</span>
							<input type="password" placeholder="四位数字" />
						</div>
						<div class="img">
							<img src="img/btnLogin.jpg" />
						</div>
						<div class="txt">
							<a href="#">
								立即注册
							</a>
							<a href="#">
								忘记密码
							</a>
						</div>
					</form>
				</div>
			</div>
			<div class="center1 clearfix">
				<div class="center1-left fl">
					<div class="center1-left-top">
						<p class="fl">全部游戏</p>
						<div class="nav fl">
							<a href="#">战争策略</a><span>|</span>
							<a href="#">体育经营</a><span>|</span>
							<a href="#">社交游戏</a>
						</div>
					</div>
					<div class="center1-left-down">
						<div class="center1-left-down1">
							<div class="l fl">
								<img src="img/img-4.jpg" />
								<div class="txt fr">
									<p>三国题材横版RPG网游，丰富的武将系统</p>
									<p>类型：角色扮演</p>
									<p>游戏人气：<span>470921</span></p>
									<a href="#" class="fu">选服</a>
									<a href="#" class="login">进入游戏</a>
								</div>
							</div>
							<div class="l fr">
								<img src="img/img-5.jpg" />
								<div class="txt fr">
									<p>一款不建主城不等CD，不占资源，全程战斗</p>
									<p>类型：战征策略</p>
									<p>游戏人气：<span>8745221</span></p>
									<a href="#" class="fu">选服</a>
									<a href="#" class="login">进入游戏</a>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="center1-right fr">
					<div class="center1-right-top">
						<p>新闻公告</p>
					</div>
					<ul>
						<li>
							<a href="#">[征战四方] 开心首服·黄巾之乱</a>
						</li>
						<li>
							<a href="#">[龙将] 火爆8服·八门金</a>
						</li>
						<li>
							<a href="#">[凡人修真2] 03月08日·四海帝王</a>
						</li>
						<li>
							<a href="#">[一骑当先] 开心2服上线送黄金</a>
						</li>
						<li>
							<a href="#">[宫廷计] 03月06日·西施秘史</a>
						</li>
						<li style="border-bottom: none;">
							<a href="#">[凡人修真2] 03月08日·四海帝王</a>
						</li>
					</ul>
				</div>
			</div>
			<div class="center2 clearfix">
				<div class="center2-left fl">
					<div class="center2-left-top">
						<p>角色扮演</p>
					</div>
					<ul>
						<li style="margin-right: 41.5px;">
							<img src="img/img-6.jpg" />
							<p>游戏人气：1765314</p>
							<p>游戏状态：<span>22区开启</span></p>
							<a href="#" class="fu">选服</a>
							<a href="#" class="login">进入游戏</a>
						</li>
						<li style="margin-right: 41.5px;">
							<img src="img/img-7.jpg" />
							<p>游戏人气：1765314</p>
							<p>游戏状态：<span>22区开启</span></p>
							<a href="#" class="fu">选服</a>
							<a href="#" class="login">进入游戏</a>
						</li>
						<li style="margin-right: 41.5px;">
							<img src="img/img-8.jpg" />
							<p>游戏人气：1765314</p>
							<p>游戏状态：<span>22区开启</span></p>
							<a href="#" class="fu">选服</a>
							<a href="#" class="login">进入游戏</a>
						</li>
						<li>
							<img src="img/img-9.jpg" />
							<p>游戏人气：1765314</p>
							<p>游戏状态：<span>22区开启</span></p>
							<a href="#" class="fu">选服</a>
							<a href="#" class="login">进入游戏</a>
						</li>
					</ul>
					<ul>
						<li style="margin-right: 41.5px;">
							<img src="img/img-10.jpg" />
							<p>游戏人气：1765314</p>
							<p>游戏状态：<span>22区开启</span></p>
							<a href="#" class="fu">选服</a>
							<a href="#" class="login">进入游戏</a>
						</li>
						<li style="margin-right: 41.5px;">
							<img src="img/img-11.jpg" />
							<p>游戏人气：1765314</p>
							<p>游戏状态：<span>22区开启</span></p>
							<a href="#" class="fu">选服</a>
							<a href="#" class="login">进入游戏</a>
						</li>
						<li style="margin-right: 41.5px;">
							<img src="img/img-12.jpg" />
							<p>游戏人气：1765314</p>
							<p>游戏状态：<span>22区开启</span></p>
							<a href="#" class="fu">选服</a>
							<a href="#" class="login">进入游戏</a>
						</li>
						<li>
							<img src="img/img-13.jpg" />
							<p>游戏人气：1765314</p>
							<p>游戏状态：<span>22区开启</span></p>
							<a href="#" class="fu">选服</a>
							<a href="#" class="login">进入游戏</a>
						</li>
					</ul>
				</div>
				<div class="center2-right fr">
					<img src="img/ad1.jpg" />
					<img src="img/ad2.jpg" />
					<div class="center2-right-down clearfix">
						<div class="center2-right-down-top">
							<p>游戏视频</p>
						</div>
						<div class="first">
							<img src="img/img-1.jpg" class="fl" />
							<div class="first-txt fl">
								<a href="#">《航海之王》麻辣</a>
								<a href="#">炫酷反穿越，英雄</a>
								<a href="#">时尚大变身!/</a>
							</div>
						</div>
						<div class="first">
							<img src="img/img-2.jpg" class="fl" />
							<div class="first-txt fl">
								<a href="#">《航海之王》麻辣</a>
								<a href="#">炫酷反穿越，英雄</a>
								<a href="#">时尚大变身!/</a>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="down">
				<ul>
					<li>
						<a href="#">关于我们</a>
					</li>
					<li>
						<a href="#">手机版</a>
					</li>
					<li>
						<a href="#">自助广告</a>
					</li>
					<li>
						<a href="#">招聘</a>
					</li>
					<li>
						<a href="#">客服</a>
					</li>
					<li>
						<a href="#">帮助</a>
					</li>
				</ul>
				<ul>
					<li>
						<span>@2017开心网</span>
					</li>
					<li>
						<span>文网文[2009]157号</span>
					</li>
					<li>
						<span>京ICP证080482号</span>
					</li>
					<li>
						<span>京公网安备110000000003号</span>
					</li>
					<li>
						<span>未成年人家长监护</span>
					</li>
				</ul>
			</div>
		</div>
	</body>
</html>
